var host = 'http://fire.tomobo.com/api/';
var tops_base = {};
updateAlertHead();

function updateAlertHead() {
  var MapsInfo = {};
  $.ajax({
    url: host + '?m=system.FrontPage.getPosition',
    type: "post",
    dataType: "json",
    async: false,
    success: function (msg) {
      MapsInfo = msg;
      init();
    }
  });

  function init() {
    tops_base = MapsInfo.base;
    var total = tops_base.total;
    var yan = tops_base.yan;
    var wen = tops_base.wen;
    var qi = tops_base.qi;
    var alert = tops_base.alert;
    var online = tops_base.online;
    var a = '';
    var b = '';
    var y = '';
    var w = '';
    var q = '';
    var rate = ((online / total) * 100).toFixed(2);

    if (Number(total) < 1) {
      b = '<button disabled="disabled" type="button" class="el-button equip-group-item el-button--text is-disabled">';
    }
    else {
      b = '<button  type="button" class="el-button equip-group-item el-button--text" onclick="device_info(1)">';
    }
    if (Number(yan) < 1) {
      y = '<button disabled="disabled" type="button" class="el-button equip-group-item el-button--text is-disabled">';
    }
    else {
      y = '<button  type="button" class="el-button equip-group-item el-button--text" onclick="device_info(2)">';
    }
    if (Number(wen) < 1) {
      w = '<button disabled="disabled" type="button" class="el-button equip-group-item el-button--text is-disabled" >';
    }
    else {
      w = '<button  type="button" class="el-button equip-group-item el-button--text" onclick="device_info(3)">';
    }
    if (Number(qi) < 1) {
      q = '<button disabled="disabled" type="button" class="el-button equip-group-item el-button--text is-disabled" >';
    }
    else {
      q = '<button  type="button" class="el-button equip-group-item el-button--text" onclick="device_info(4)">';
    }
    if (Number(alert) < 1) {
      a = '<button disabled="disabled" type="button" class="el-button equip-group-item el-button--text is-disabled" >';
    }
    else {
      a = '<button  type="button" class="el-button equip-group-item el-button--text" onclick="device_info(5)">';
    }
    var head = '' + b +
      '<span style="font-size: 16px"><i class="icon-web-icon- equip-group-icon" style="font-size: 23px; margin: -5px 5px 0px 0px;"></i>设备：' + total + '</span>' +
      '</button>' + y +
      '<span style="font-size: 16px"><i class="icon-yangantanceqi equip-group-icon" style="font-size: 23px; margin: -5px 5px 0px 0px;"></i>烟感：' + yan + '</span>' +
      '</button>' + w +
      '<span style="font-size: 16px"><i class="icon-thermometer equip-group-icon" style="font-size: 24px; margin: -5px 1px 0px 0px;"></i>温感：' + wen + '</span>' +
      '</button>' + q +
      '<span style="font-size: 16px"><i class="icon-combustible-gas equip-group-icon" style="font-size: 23px; margin: -5px 5px 0px 0px;"></i>气感：' + qi + '</span>' +
      '</button>' + a +
      '<span style="font-size: 16px"><i class="icon-zuoyebaojing equip-group-icon" style="font-size: 24px; margin: -8px 5px 0px 0px; color: rgb(255, 0, 0);"></i>报警：' + alert + '</span>' +
      '</button>' +
      '<div class="equip-group-item" style="margin-left: 10px;font-size: 16px;display: inline-block">' +
      '<i class="icon-zaixian equip-group-icon" style="font-size: 22px; margin: -5px 5px 0px 0px;"></i>在线：' + rate + '%' +
      '</div>';
    $("#alert_head").html(head);
  }
}
var detail;
function device_info(v) {
  var data = { 'type': v };
  $.ajax({
    url: host + '?m=system.FrontPage.getPosition',
    type: "post",
    data: data,
    dataType: "json",
    async: false,
    success: function (msg) {
      detail = msg;
      showList(1);
    }
  });
}

function showList(page) {
  var base = detail.base;
  var list = detail.info;
  var total = base.total;
  var nstandby = total - base.standby;
  var standby = base.standby;
  var alert = base.alert;
  var context = '';
  var e = '';
  var next = '';
  var up = '';
  var b = '';
  var pageNum = Math.ceil(Number(total) / 4);
  if (pageNum == 1) {
    b = '<button disabled="disabled"  type="button" class="el-button el-button--default el-button--mini is-disabled"  style="padding: 7px; margin-left: 2px;">' +
      '<i class="el-icon-arrow-left"></i>' +
      '</button>' +
      '<button disabled="disabled" type="button"  class="el-button el-button--default el-button--mini is-disabled"style="padding: 7px; margin-left: 2px;" >' +
      '<i class="el-icon-arrow-right"></i>' +
      '</button>';
  }
  else if (Number(page) == 1) {
    next = Number(page) + 1;
    b = '<button disabled="disabled" type="button" class="el-button el-button--default el-button--mini is-disabled"  style="padding: 7px; margin-left: 2px;">' +
      '<i class="el-icon-arrow-left"></i>' +
      '</button>' +
      '<button type="button" onclick="showList(' + next + ')" class="el-button el-button--default el-button--mini "style="padding: 7px; margin-left: 2px;" >' +
      '<i class="el-icon-arrow-right"></i>' +
      '</button>';
  }
  else if (Number(page) == pageNum) {
    next = Number(page) - 1;
    b = '<button  type="button" onclick="showList(' + next + ')" class="el-button el-button--default el-button--mini"  style="padding: 7px; margin-left: 2px;">' +
      '<i class="el-icon-arrow-left"></i>' +
      '</button>' +
      '<button disabled="disabled" type="button"  class="el-button el-button--default el-button--mini is-disabled"style="padding: 7px; margin-left: 2px;" >' +
      '<i class="el-icon-arrow-right"></i>' +
      '</button>';

  }
  else {
    next = Number(page) - 1;
    up = Number(page) + 1;
    b = '<button  type="button" onclick="showList(' + next + ')" class="el-button el-button--default el-button--mini "  style="padding: 7px; margin-left: 2px;">' +
      '<i class="el-icon-arrow-left"></i>' +
      '</button>' +
      '<button type="button" onclick="showList(' + up + ')" class="el-button el-button--default el-button--mini "style="padding: 7px; margin-left: 2px;" >' +
      '<i class="el-icon-arrow-right"></i>' +
      '</button>';
  }

  var num = (Number(page) - 1) * 4;
  for (var i = num; i < list.length; i++) {
    if (i >= 4 * page) {
      break;
    }
    e += '<div role="group" aria-label="checkbox-group" class="el-checkbox-group">' +
      '<div class="facility-card" style="margin-left: 10px;">' +
      '<div class="facility-card__header">' +
      '<label role="checkbox" class="el-checkbox" style="display: inline-block; position: relative; top: -6px;">' +
      '<span aria-checked="mixed" onclick="checkedP()" class="el-checkbox__input"><span class="el-checkbox__inner"></span><input type="checkbox" class="el-checkbox__original" value=""></span><span class="el-checkbox__label">&nbsp;</span></label>' +
      '<div class="facility-card__icon"><i class="el-icon-setting"></i></div></div>' +
      '<div class="facility-card__content">' +
      '<div class="facility-card__title"><span style="color: rgb(24, 144, 255); cursor: pointer;">' + list[i].codeserial + '</span></div>' +
      '<div class="facility-card__address"><span class="address_item text-ellipsis">' + list[i].device_address + '</span></div>' +
      '</div>' +
      '</div>' +
      '</div>';
  }

  var btna = '';
  var btnb = '';
  var btng = '';
  var btnz = '';
  btna += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item" >' +
    '<span><div class="alarmlist-header-number">' + total + '</div>全部</span>' +
    '</button>';
  if (alert > 0) {
    btnb += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item" >' +
      '<span><div class="alarmlist-header-number">' + alert + '</div>报警</span>' +
      '</button>';
  }
  else {
    btnb += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item is-disabled" disabled="disabled">' +
      '<span><div class="alarmlist-header-number">' + alert + '</div>报警</span>' +
      '</button>';
  }
  if (nstandby > 0) {
    btng += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item " >' +
      '<span><div class="alarmlist-header-number">' + nstandby + '</div>故障</span>' +
      '</button>';
  }
  else {
    btng += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item is-disabled" disabled="disabled">' +
      '<span><div class="alarmlist-header-number">' + nstandby + '</div>故障</span>' +
      '</button>';
  }
  if (standby > 0) {
    btnz += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item" >' +
      '<span><div class="alarmlist-header-number">' + standby + '</div>正常</span>' +
      '</button>';
  }
  else {
    btnz += '<button type="button" class="el-button alarmlist-header-item el-button--text equip-group-item is-disabled" disabled="disabled">' +
      '<span><div class="alarmlist-header-number">' + standby + '</div>正常</span>' +
      '</button>';
  }
  context = '' +
    '<div class="el-card__body">' +
    '<button style=" position: absolute;top:0;right: 0;height:100%;padding: 0 7px;"  type="button" onclick="hidenInfo()" class="el-button alarmlist-show-btn el-button--text">' +
    '<span><i class="el-icon-d-arrow-left" style="font-size:18px;"></i></span>' +
    '</button>' +
    '<div class="alarmlist-header" style="display: flex;padding: 10px 0;margin-bottom: 20px;cursor: pointer;" id="info">' +
    btna +
    btnb +
    btng +
    btnz +
    '</div>' +
    '<div class="alarmlist-content">'
    + e +
    '<div class="alarmlist-pagetool"><span class="alarmlist-pagetool-number">' + page + '/' + pageNum + '</span>'
    + b +
    '</div>' +
    '</div>' +
    '</div>';
  $('#infomation').html('');
  $('#infomation').html(context)
}
function hidenInfo() {
  $('#infomation').html('');
}

function markerClick(e) {
  var codeserial = e.target.codeserial;
  var device_address = e.target.device_address;
  var content = '' +
    '<div class="el-card__body">' +
    '<button style="position: absolute;top:0;right: 0;height:100%;padding: 0 7px;" type="button" onclick="hidenInfo()" class="el-button alarmlist-show-btn el-button--text">' +
    '<span><i class="el-icon-d-arrow-left" style="font-size:18px;"></i></span>' +
    '</button>' +
    '<div class="alarmlist-header" style="display: flex;padding: 10px 0;margin-bottom: 20px;cursor: pointer;">' +
    '<button type="button" class="el-button alarmlist-header-item el-button--text" style="color: rgb(24, 144, 255);">' +
    '<span><div class="alarmlist-header-number">1</div>全部</span>' +
    '</button>' +
    '<button type="button" class="el-button alarmlist-header-item el-button--text is-disabled" style="color: rgb(48, 49, 51)" disabled="disabled">' +
    '<span><div class="alarmlist-header-number">0</div>报警</span>' +
    '</button>' +
    '<button type="button" class="el-button alarmlist-header-item el-button--text is-disabled" style="color: rgb(48, 49, 51)" disabled="disabled">' +
    '<span><div class="alarmlist-header-number">0</div>故障</span>' +
    '</button>' +
    '<button type="button" class="el-button alarmlist-header-item el-button--text" style="color: rgb(48, 49, 51);">' +
    '<span><div class="alarmlist-header-number">1</div>正常</span>' +
    '</button>' +
    '</div>' +
    '<div class="alarmlist-content">' +
    '<div role="group" aria-label="checkbox-group" class="el-checkbox-group"> ' +
    '<div class="facility-card" style="margin-left: 10px;">' +
    '<div class="facility-card__header"><label role="checkbox" class="el-checkbox" style="display: inline-block; position: relative; top: -6px;"><span aria-checked="mixed" class="el-checkbox__input"><span class="el-checkbox__inner"></span><input type="checkbox" aria-hidden="true" class="el-checkbox__original" value=""></span><span class="el-checkbox__label">&nbsp;</span></label><div class="facility-card__icon"><i class="el-icon-setting"></i></div></div>' +
    '<div class="facility-card__content">' +
    '<div class="facility-card__title"><span style="color: rgb(24, 144, 255); cursor: pointer;">' + codeserial + '</span></div>' +
    '<div class="facility-card__address"><span class="address_item text-ellipsis">' + device_address + '</span></div>' +
    '</div>' +
    '</div>' +
    '</div>' +
    '</div>' +
    '<div class="alarmlist-pagetool">' +
    '<div class="alarmlist-pagetool-btns">' +
    '<button disabled="disabled" type="button" class="el-button facility-card__dispose el-button--text is-disabled" style="padding: 0px 10px;"><span>处置</span></button>' +
    '</div>' +
    '</div>' +
    '</div>';
  $('#infomation').html('');
  opendInfo(content);
}
function opendInfo(content) {
  $('#infomation').html(content)
}
